<!doctype html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
	<link rel="stylesheet" type="text/css" href="style/css.css">
	<title>任务</title>
	<script src="js/jquery-1.8.3.min.js"></script>
	<script type="text/javascript">
	$(document).ready(function(){
		
	 var n=1;
	 var curIndex=0;
	function change(){
	  n++;
	  if(n>5)
	 	 n=1;
	  $("#bigimg").attr("src", "images/"+n+".jpg");

	  var arr=new Array(); 
		arr[0]="Big Game第二季-高额德州扑克现金桌真人秀节目"; 
		arr[1]="2017年澳洲百万豪客赛 2"; 
		arr[2]="德州扑克美女牌手之ABANATHY"; 
		arr[3]="2017年澳洲百万豪客赛 1"; 
		arr[4]="Dwan幕后赞助人曝光，现场打牌不被人砍的攻略";  
	  if (curIndex==arr.length-1) 
	   {curIndex=0;}
	  else 
	   {curIndex+=1;}  
	  var obj=arr[curIndex];
      $("#bigdiv-div").text(obj);

       $('.play3').css('display','none');
	   $('.play3').eq(n-1).css('display','block');
	   $('.li-font').removeClass('f');
	   $('.li-font').eq(n-1).addClass('f');
  	}
	var stop=setInterval(change,1000);
		$("li").hover(
          function() {
          	clearInterval(stop);
          	$('.play3').eq(n-1).css('display','none');
          	$('.li-font').eq(n-1).removeClass('f');

            $(this).css("color", 'red');
            $(this).find('.play3').show();
            var a=$(this).find(".li-img").attr("src");
            $("#bigimg").attr("src",a);
            var Con=$(this).find('.li-font').html();
            $('#bigdiv-div').html(Con);
          },
           function() {
			stop=setInterval(change,1000);      
           	$(this).css("color", 'black');
            $(this).find('.play3').hide();
          }
        );
		 $("#big").mouseenter(function(){
   		clearInterval(stop);
   		

   		});
		  $("#big").mouseleave(function(){
    	stop=setInterval(change,1000)});
 });
    </script>
</head>
<body>
<div id="main">
	<div id="big">
	 <img id="bigimg" src ="images/1.jpg">
	 <div class="bigdiv">
	 	<img class="play2" src="images/play2.png" >
		<div id="bigdiv-div">Big Game第二季-高额德州扑克现金桌真人秀节目</div>
	 </div>
	</div>
	<div id="small">
	 	<ul>	
 	 		<li> 
 	 			<div class="list">
 	 			 <img class="li-img" src="images/1.jpg" />
 	 			 <div class="play3"><img src="images/play3.png"></div>
 	 			 <p class="li-font" >Big Game第二季-高额德州扑克现金桌真人秀节目</p>
 	 			</div>
 	 		</li>
 	 		<li>
 	 			<div class="list">
 	 		 	 <img class="li-img" src="images/2.jpg" />
 	 		 	 <div class="play3"><img src="images/play3.png"></div>
 	 		 	 <p class="li-font" >2017年澳洲百万豪客赛 2</p>
 	 		 	</div>
 	 		</li>
 	 		<li>
 	 		 	<div class="list">
 	 		 	 <img class="li-img"  src="images/3.jpg" />
 	 		 	 <div class="play3"><img src="images/play3.png"></div>
 	 		 	 <p class="li-font" >德州扑克美女牌手之ABANATHY</p>
 	 		 	</div>
 	 		</li>
 	 		<li>
				<div class="list">
 	 		  	 <img class="li-img"  src="images/4.jpg" />
 	 		  	 <div class="play3"><img src="images/play3.png"></div>
 	 		  	 <p class="li-font" >2017年澳洲百万豪客赛 1</p>
				<div>
 	 		</li>
 	 		<li>
				<div class="list"> 
 	 		 	 <img class="li-img" src="images/5.jpg" />
 	 		 	 <div class="play3"><img src="images/play3.png"></div>
 	 		 	 <p class="li-font" >Dwan幕后赞助人曝光，现场打牌不被人砍的攻略<p>
				</div>
 	 		</li>
 		</ul>
	</div>
</div>
</body>
</html>